<template>
	<view class="module-block">
		<view class="invoice-info">
			<view class="title">发票信息</view>
			<view class="group" @click="selectInvoice">
				<view class="group-item">
					<view class="label">发票类型</view>
					<view class="right">
						<text class="value" v-if="invoiceInfo.needBill">{{invoiceInfo.invoiceInfo.type==2?'增值发票':'普通发票'}}</text>
						<text class="value" v-else>不开发票</text>
						<text class="iconfont">&#xe67f;</text>
					</view>
				</view>
				<view class="group-item" v-if="invoiceInfo.needBill">
					<view class="label">发票抬头</view>
					<view class="right"><text class="value">{{invoiceInfo.invoiceInfo.title}}</text></view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	/**
	 * 发票信息
	 * 
	 */
	export default {
		name: 'stInvoiceInfo',
		props: {
			invoiceInfo:{
				type: Object,
				default(){
					return {}
				}
			}
		},
		data() {
			return {}
		},
		methods: {
			selectInvoice(){
				this.$emit('select')
			}
		}
	}
</script>
<style lang="scss" scoped>
	.module-block{
		padding:0 24rpx;
		margin-bottom: 20rpx;
	}
	.invoice-info{
		padding: 28rpx 24rpx 0;
		border-radius: 20rpx;
		background-color: $uni-bg-color;
		.title{
			line-height: 1.24;
			font-size: 34rpx;
			font-weight: bold;
		}
		.group{
			padding: 20rpx 0;
			font-size: $uni-font-size-base;
			.group-item{
				@extend .justifyspacec;
				height: 88rpx;
				.right{
					max-width: 450rpx;
					@extend .flex1;
					@extend .ellipse;
					text-align: right;
					.iconfont{
						margin-left: 4rpx;
						color: #a0a0a0;
					}
				}
			}
		}
	}
</style>
